import React from 'react'
import { Input } from 'antd'
import { connect } from 'umi'


type Props = {
    title: string,
    type: string,
    hero: any,
    index: number,
    dispatch: any,
    iptType: string,
    prop: string
}

function SkillInput({ title, type, hero, index, dispatch, iptType, prop }: Props) {
    const InpOrText = iptType ? Input.TextArea : Input
    return (
        <div className='banner_flex mt15'>
            <span className='left_text mr15'>
                {title}
            </span>
            <InpOrText
                onChange={(ev) => {
                    dispatch({ type: "hero/setProps", skills: prop, index, action: type, val: ev.target.value })
                }}
                value={hero[prop][index][type]} />
        </div>
    )
}

const mapStateToProps = (state: any) => {
    const { hero } = state
    return {
        hero
    }
}

export default connect(mapStateToProps)(SkillInput)